<template>
	<view>
		<u-gap height="30" bgColor="#ffffff"></u-gap>
		<u-gap height="30" bgColor="#ffffff"></u-gap>
		<view class="top_mag_big">
			<u-upload :previewFullImage="true" :fileList="info.useravatarCover" @afterRead="afterRead"
				@delete="deletePic" name="1" multiple :maxCount="1">
			</u-upload>
			<u-input border="surround" placeholder="请输入您的账号" v-model="info.username" clearable />
			<u-input type="password" border="surround" placeholder="请输入您的密码" v-model="info.password" clearable />
			<u-input type="password" border="surround" placeholder="请再次输入您的密码" v-model="info.agnpassword" clearable />
			<u-cell :title="info.sex==''?'您的性别':info.sex" @click='showsex'></u-cell>
			<u-picker :show="showsexpicker" :columns="sexs" @confirm='showSexPick'></u-picker>
			<u-input border="surround" placeholder="请输入您的个性名称" v-model="info.nickname" clearable />
			<u-cell :title="info.birthday==''?'您的生日':info.birthday" @click='showdate'></u-cell>
			<u-datetime-picker v-model="value1" @cancel='showdate' @confirm='sureDate' :show="show" mode="date"
				:minDate="-2209017600">
			</u-datetime-picker>
			<button @click="userRegister" type="primary">注册</button>
		</view>
	</view>
</template>

<script>
	import {
		register
	} from '@/config/api.js'
	export default {
		data() {
			return {
				info: {
					username: '',
					password: '',
					agnpassword: '',
					nickname: '',
					birthday: '',
					useravatarCover: [{
						url: ''
					}],
					sex: '男'
				},
				showsexpicker: false,
				show: false,
				value1: Number(new Date()),
				sexs: [
					['男', '女']
				],
			}
		},
		methods: {
			showdate() {
				this.show = !this.show
			},
			showsex() {
				this.showsexpicker = !this.showsexpicker
			},
			sureDate(e) {
				this.show = !this.show
				this.info.birthday = uni.$u.timeFormat(e, 'yyyy-mm-dd')
				console.log(this.value1);
				console.log(this.info.birthday);
			},
			showSexPick(e) {
				console.log(e.value[0]);
				this.info.sex = e.value[0]
				this.showsexpicker = false
			},
			userRegister() {
				if (this.info.password != this.info.agnpassword) {
					uni.$u.toast("两次输入的密码不一致")
				} else {
					register({
						userAvatar: this.info.useravatarCover.url,
						userBirthday: this.info.birthday,
						userName: this.info.username,
						userNickname: this.info.nickname,
						userPassword: this.info.password,
						userSex: this.info.sex
					}).then((res) => {
						//到这里说明注册成功
						uni.$u.toast("注册成功")
						this.info.birthday = ''
						this.info.username = ''
						this.info.nickname = ''
						this.info.password = ''


					}).catch(() => {

					})
				}
				//信息校验以及发送请求 todo
				console.log(this.info.nickname);
				console.log(this.info.password);
				console.log(this.info.agnpassword);
				console.log(this.info.birthday);
				console.log(this.info.useravatarCover.url);
				console.log(this.info.username);
				console.log(this.info.sex);

			},
			//删除图片
			deletePic(event) {
				this.info.useravatarCover.splice(event.index, 1)
			},

			//添加图片
			async afterRead(event) {
				let img = [].concat(event.file)
				let fileListen = this.info.useravatarCover.length
				img.map((item) => {
					this.info.useravatarCover.push({
						item,
						status: 'uploading',
						message: '上传中'
					})
				})
				for (let i = 0; i < img.length; i++) {
					const result = await this.uploadFilePromise(img[i].url)
					let item = this.info.useravatarCover[fileListen]
					this.info.useravatarCover.splice(fileListen, 1, Object.assign(item, {
						status: 'success',
						message: '',
						url: result
					}))
					fileListen++
				}
			},
			uploadFilePromise(url) {
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: 'http://localhost:8080/upload/fileoss/upAvatar',
						filePath: url,
						name: 'file',
						formData: {
							user: 'test'
						},
						success: (res) => {
							setTimeout(() => {
								resolve(res.data.data)
							}, 1000)
							let data = JSON.parse(res.data);
							console.log(data.data);
							console.log(data.data.url);
							this.info.useravatarCover.url = data.data.url
							console.log(this.info.useravatarCover.url)
						}
					});
				})
			},
		}
	}
</script>

<style>

</style>
